/*
* 反馈通5期公交线路查询
* html需要引入jquery，使用了高德地图API,
* 2015-7-28
*/
$(function(){
    //从接口查询到的城市信息对象
    var city_info;
    //起点经度和纬度
    var start_longitude,start_latitude;
    //终点经度和纬度
    var end_longitude,end_latitude;
    //地图对象
    var map;
    //多个异步请求是否都成功的标志
    var request_ok = {count_req:0, count_ok : 0};
    //定时器id
    var id_interval;
    //初始化地图窗口
    function feedbackMapWinInit(address_end){
        if($('.feedbackMap').length == 0){
            $('body').prepend(
                '<div class="feedbackMap">'+
                    '<h2 class="mapH">乘车路线<span class="mapClose"></span></h2>'+
                    '<div class="mapMain">'+
                        '<div class="mapDet">'+
                            //此处是地图
                            '<div id="mapContainer" class="mapDet"></div>'+
                        '</div>'+
                        '<div class="mapCon">'+
                            '<div class="mapAdd">'+
                                '<input type="text" class="mapStart" name="" id="start" value="请输入公交起点" />'+
                                '<input type="text" class="mapEnd" name="" id="" value="请输入公交终点" />'+
                                '<span class="mapChange"></span>'+
                            '</div>'+
                            '<div class="mapBtn"><span class="mapSearch">查询路线</span></div>'+
                            '<div class="mapList"></div>'+
                        '</div>'+
                    '</div>'+
                '</div>'+
                '<div class="mapFullbg"></div>'
            );
            //显示map div
            showMapDiv();
            //初始化地图
            mapInit(address_end);
            //input框仿placeholder效果
            if($(".mapStart").val() == "请输入公交起点"){
                $(".mapStart").css("color","rgb(204,204,204)")
            }else{
                $(".mapStart").css("color","rgb(51,51,51)")
            }
            if($(".mapEnd").val() == "请输入公交终点"){
                $(".mapEnd").css("color","rgb(204,204,204)")
            }else{
                $(".mapEnd").css("color","rgb(51,51,51)")
            }
            $(".mapStart").focus(function(){
                if($(this).val() == "请输入公交起点"){
                    $(this).val("");
                }
                startColor();
            }).blur(function(){
                    if($(this).val() == ""){
                        $(this).val("请输入公交起点");
                    }
                    startColor();
                })
            $(".mapEnd").focus(function(){
                if($(this).val() == "请输入公交终点"){
                    $(this).val("");
                }
                endColor();
            }).blur(function(){
                    if($(this).val() == ""){
                        $(this).val("请输入公交终点");
                    }
                    endColor();
                })
            function startColor(){
                if($(".mapStart").val() == "请输入公交起点"){
                    $(".mapStart").css({"color":"rgb(204,204,204)"});
                }else{
                    $(".mapStart").css({"color":"rgb(51,51,51)"});
                }
            }
            function endColor(){
                if($(".mapEnd").val() == "请输入公交终点"){
                    $(".mapEnd").css("color","rgb(204,204,204)");
                }else{
                    $(".mapEnd").css("color","rgb(51,51,51)");
                }
            }
            //起点终点交换位置
            $(".mapChange").click(function(){
                var changeVal = null;
                var start_color_str = $(".mapStart").css("color").replace(/ /g, '');
                var end_color_str = $(".mapEnd").css("color").replace(/ /g, '');
                var color_str = "rgb(51,51,51)";
                if(start_color_str == color_str && end_color_str == color_str){
                    changeVal = $(".mapStart").val();
                    $(".mapStart").val($(".mapEnd").val()) ;
                    $(".mapEnd").val(changeVal);
                }else if(start_color_str == color_str && end_color_str != color_str){
                    $(".mapEnd").val($(".mapStart").val()).css("color","rgb(51,51,51)");
                    $(".mapStart").val("请输入公交起点").css("color","rgb(204,204,204)");
                }else if(start_color_str != color_str && end_color_str == color_str){
                    $(".mapStart").val($(".mapEnd").val()).css("color","rgb(51,51,51)");
                    $(".mapEnd").val("请输入公交终点").css("color","rgb(204,204,204)");
                }
            })
            //关闭按钮
            $(".mapClose").click(function(){
                //清除定时器
                clearInterval(id_interval);
                $(".feedbackMap,.mapFullbg").fadeOut(400);
            })
            //随窗口大小改变遮罩和地图div的大小
            $(window).on('resize scroll', function(){
                $('.feedbackMap').is(':visible') ? showMapDiv() : '';
            });
            //查询路线按钮
            $('.mapSearch').on('click', function(){
                //如果没有城市信息或上次请求还没有结束，则不执行查询操作
                if(!city_info || request_ok.count_req != 0){
                    return;
                }
                //清空地图覆盖物
                map.clearMap();
                //起点地址名称
                var address_start = $.trim($('.mapStart').val());
                //终点地址名称
                var address_end = $.trim($('.mapEnd').val());
                if(address_start && address_start != '请输入公交起点' && address_end && address_end != '请输入公交终点'){
                    //查询时右侧公交线路列表等待效果
                    $('.mapList').html('<div style="display: block;text-align:center;"><img src="http://img01.zhaopin.cn/2014/i/img/feedback/loading.gif" style="height:30px;width:30px;margin-top:15px;"></div>');
                    //查询获取起点的经度和纬度
                    getLonLatByAddress(address_start, function(lon, lat){
                        start_longitude = lon;
                        start_latitude = lat;
                    }, '起点');
                    //查询获取终点的经度和纬度
                    getLonLatByAddress(address_end, function(lon, lat){
                        end_longitude = lon;
                        end_latitude = lat;
                    }, '终点');
                    request_ok.count_req = 2;
                    var timeOut = 0;
                    id_interval = setInterval(function(){
                        if(request_ok.count_req ==  request_ok.count_ok){
                            clearInterval(id_interval);
                            request_ok.count_req = 0;
                            request_ok.count_ok = 0;
                            //查询公交路线
                            if(start_longitude && start_latitude && end_longitude && end_latitude){
                                transfer_route();
                            }
                        }else if(timeOut > 60){
//                            alert('路线起点和终点的经纬度查询失败');
                            //清除右侧的等待效果
                            $('.mapList').html('');
                            clearInterval(id_interval);
                            request_ok.count_req = 0;
                            request_ok.count_ok = 0;
                        }
                        timeOut += 1;
                    },1000);
                }else{
                    alert('必须输入路线的起点和终点');
                }
                //数据统计埋点
                dyweTrackEvent('feedbackMapDialog','clickQueryButton');
            });
        }else{
            //右侧公交线路列表设置为空
            $('.mapList').html('');
            //清空地图以及其他全局的变量
            map.clearMap();
            city_info = undefined;
            start_longitude = undefined;
            start_latitude = undefined;
            end_longitude = undefined;
            end_latitude = undefined;
            request_ok = {count_req:0, count_ok : 0};
            //显示map div
            showMapDiv();
            //初始化地图
            mapInit(address_end);
        }
    }
    //显示地图窗口
    function showMapDiv(){
        var winW = document.documentElement.clientWidth || document.body.clientWidth;
        var winH = document.documentElement.clientHeight || document.body.clientHeight;
        $(".mapFullbg").css({"width":$(document).width(),"height":$(document).height()});
        //滚动条的高度
        var scrollTop = $(window).scrollTop();
        //弹窗的位置
        var mapTop = winH/2-($(".feedbackMap").height()/2) + scrollTop;
        var mapLeft;
        mapTop = mapTop<=0?0:winH/2-($(".feedbackMap").height()/2) + scrollTop;
        mapLeft = winW/2-($(".feedbackMap").width()/2);
        $(".feedbackMap").css({"top":mapTop,"left":mapLeft});
        //地图模块的宽
        $(".mapDet").width(($(".feedbackMap").width() - 261)+"px");
        //显示遮罩和地图
        $(".mapFullbg").is(':hidden') ? $(".mapFullbg").show() : '';
        $(".feedbackMap").is(':hidden') ? $(".feedbackMap").show() : '';
    }
    //初始化地图
    function mapInit(addressEnd){
        //设置终点的地址及面试地址
        $('.mapEnd').val(addressEnd).trigger('focus');
        //初始化加载地图时，若center及level属性缺省，地图默认显示用户当前城市范围
        map = new AMap.Map('mapContainer', {
            resizeEnable: true,
            zoom:11//[3,18]3国家级 11市级 17街道级；zoom值11是地图放大到到市级别
        });
        //删除高德标志
//        $('.amap-logo').remove();
//        $('.amap-copyright').remove();
        //地图中添加地图操作ToolBar插件
        map.plugin(['AMap.ToolBar'],function(){
            //设置地位标记为自定义标记
            var toolBar = new AMap.ToolBar();
            map.addControl(toolBar);
        });
        //获取城市信息{province: "北京市", city: "", citycode: "010", district: "东城区"}，
        // 并根据获得的数据对终点addressEnd定位
        map.getCity(function(data){
            //根据已加载的城市进行定位
            if(data && data.citycode){
                city_info = data;
                AMap.service(["AMap.PlaceSearch"], function() {
                    var MSearch = new AMap.PlaceSearch({ //构造地点查询类
                        pageSize:1,
                        pageIndex:1,
                        city:data.citycode //城市编码
                    });
                    //关键字查询终点addressEnd并进行定位
                    if(addressEnd){
                        MSearch.search(addressEnd, function(status, result){
                            if(status === 'complete' && result.info === 'OK'){
                                var poiArr = result.poiList.pois;
                                var resultCount = poiArr.length;
                                for (var i = 0; i < resultCount; i++) {
                                    addmarker(i, poiArr[i]);
                                }
                                map.setFitView();
                            }else{
                                alert('没有查询到终点的数据');
                                //清除右侧的等待效果
                                $('.mapList').html('');
                            }
                        });
                    }
                });
            }else{
                alert('获取城市信息失败！');
            }
        });
    }
    //根据地址名称查询经度和纬度
    function getLonLatByAddress(address, callback, tipText){
        AMap.service(["AMap.PlaceSearch"], function() {
            var MSearch = new AMap.PlaceSearch({ //构造地点查询类
                pageSize:1,
                pageIndex:1,
                city:city_info.citycode //城市编码
            });
            //关键字查询起点和终点的经纬度
            MSearch.search(address, function(status, result){
                if(status === 'complete' && result.info === 'OK'){
                    var poiArr = result.poiList.pois;
                    var resultCount = poiArr.length;
                    var lon = poiArr[0].location.getLng(), lat = poiArr[0].location.getLat();
                    typeof callback == 'function'? callback(lon, lat) : '';
                    //请求获得响应后赋值为true
                    if(request_ok.count_req != 0){
                        request_ok.count_ok += 1;
                    }
                }else{
                    alert(tipText + '定位失败');
                    //清除定时器
                    clearInterval(id_interval);
                    request_ok.count_req = 0;
                    request_ok.count_ok = 0;
                    //清除右侧的等待效果
                    $('.mapList').html('');
                }
            });
        });
    }
    //获取公交线路数据
    function transfer_route() {
        var trans;
        //加载公交换乘插件
        AMap.service(["AMap.Transfer"], function() {
            transOptions = {
                city: city_info.citycode,//指定城市
                policy: AMap.TransferPolicy.LEAST_TIME //乘车策略
            };
            //构造公交换乘类
            trans = new AMap.Transfer (transOptions);
            //根据起、终点坐标查询公交换乘路线
            trans.search(new AMap.LngLat(start_longitude,start_latitude), new AMap.LngLat(end_longitude,end_latitude), function(status, result){
                if(status === 'complete'){
                    //查询到线路时result对象的值{info: "OK", origin: c, destination: c, taxi_cost: 70, plans: Array[5]}
                    //没有查询到线路时result对象的值{info: "NO_DATA"}
                    if(result.info == 'NO_DATA'){
                        alert('没有查到公交线路');
                        //没有查到公交线路，清除右侧的等待效果
                        $('.mapList').html('');
                    }else{
                        transCallBack(result);
                    }
                }else{
                    alert('没有查到公交线路');
                    //没有查到公交线路，清除右侧的等待效果
                    $('.mapList').html('');
                }
            });
        });
    }
    //显示所有公交线路列表并绘制第一条公交线路
    function transCallBack(data) {
        var btCount       = data.count;
        var btPlans       = data.plans;
        var btOrigin      = data.origin;
        var btDestination = data.destination;
        var btTaxiCost    = data.taxi_cost;
        //可以使用地理编码解析起点和终点坐标
        var startName     = $.trim($('.mapStart').val());//起点名称
        var endName       = $.trim($('.mapEnd').val());//终点名称
        var walkStepsArray = [];
        var busStepsArray  = [];
        //保存所有线路的概要信息
        var linesArr = [];
        //遍历每种换乘方案
        for (var i = 0; i < btPlans.length; i++) {
            var btDistance  = btPlans[i].distance;
            var btseg       = btPlans[i].segments;
            var lineNameArr = new Array();
            //一条线路完整的概要信息
            var resLine = '';
            //一条线路乘车或步行概要信息
            var lineSubArr = '';
            //一条线路所需时间
            var withTime = 0;
            //每段步行和乘车的线路
            var BusArr = [];
            var WalkArr = [];
            var lineName;
            //每条线路路详细信息
            for(var j = 0; j < btseg.length; j++) {
                withTime += btseg[j].time;
                //步行 btseg[j].transit_mode =="WALK"  公交汽车 btseg[j].transit_mode =="BUS"  地铁 btseg[j].transit_mode =="SUBWAY"
                if(btseg[j].transit_mode =="WALK") {
                    //保存步行线路
                    WalkArr.push(btseg[j].transit.path);
                    //拼接路线指导信息，起点：map_1     终点：map_2     步行：map_3     公交：map_4
                    lineSubArr += '<p class="map_3">' + btseg[j].instruction + '</p>';
                }
                else {
                    lineName = btseg[j].transit.lines[0].name.replace(/\(\S*\)/, '');//去掉路线名称信息中的括号
                    lineNameArr.push(lineName);
                    //保存公交线路
                    BusArr.push(btseg[j].transit.path);
                    //拼接路线指导信息，起点：map_1     终点：map_2     步行：map_3     公交：map_4
                    lineSubArr += '<p class="map_4">' + btseg[j].instruction + '</p>';
                }
            }
            walkStepsArray.push(WalkArr);
            busStepsArray.push(BusArr);
            lineName = lineNameArr.join("-->");
            //查询到线路后先展示第一种结果
            if(i===0){
                //清空地图覆盖物
                map.clearMap();
                //保存需要持续显示即click后显示的线路的索引
                map.line_stay_index = 0;
                //绘制第一条线路
                drawBuschangeLine(btOrigin,btDestination,busStepsArray[0],walkStepsArray[0], map, btPlans[0], {'bus' : '#32bceb', 'walk' : '#6EB034'}, true);
            }
            //起点：map_1     终点：map_2     步行：map_3     公交：map_4
            resLine = '<div class="mapCole">' +
                '<h4><span>' + (i + 1) + '</span><div><p>' + lineName + '</p><small>' + GetTime(withTime) + '|' + Getdistance(btDistance) + '</small></div></h4>' +
                '<div class="mapListDet"><div class="mapLine"></div>' +
                '<div class="mapP">'+
                '<p class="map_1">' + startName + '</p>' +
                lineSubArr +//线路详细指导
                '<p class="map_2">' + endName + '</p>' +
                '</div>' +
                '</div>' +
                '</div>';
            linesArr.push(resLine);
        }
        //右侧路线概要信息列表
        $('.mapList').html(linesArr.join(''));
        //点击或者鼠标悬停时绘制线路、以及显示下拉信息
        $('.mapCole h4').each(function(index, ele){
            $(ele).on('click', function(){
                //显示下拉信息，并计算mapline的长度
                var LineHeight = $(this).siblings(".mapListDet").height()-40;
                $(this).siblings(".mapListDet").find(".mapLine").height(LineHeight);
                if($(this).siblings(".mapListDet").is(':hidden')){
                    $(this).addClass("deep");
                    $(this).siblings(".mapListDet").slideDown(400);
                    //点击线路概要信息时如果显示的不是当前线路则绘制线路
                    if(map.line_stay_index != index){
                        //清空地图覆盖物
                        map.clearMap();
                        map.line_stay_index = index;
                        //绘制线路
                        drawBuschangeLine(btOrigin,btDestination,busStepsArray[index],walkStepsArray[index], map, btPlans[index], {'bus' : '#32bceb', 'walk' : '#6EB034'}, true);
                    }
                    //收起其他路线的指导信息并删除class的值deep
                    $(this).parent().siblings().children('.mapListDet').slideUp(400).siblings().removeClass("deep");
                }else{
                    $(this).removeClass("deep");
                    $(this).siblings(".mapListDet").slideUp(400);
                }
            }).on('mouseenter', function(){
                if(map.line_stay_index != index){
                    //绘制线路
                    drawBuschangeLine(btOrigin,btDestination,busStepsArray[index],walkStepsArray[index], map, btPlans[index], {'bus' : '#005cb5', 'walk' : '#35C224'}, false);
                }
            }).on('mouseleave', function(){
                if(map.line_stay_index != index){
                    //清空地图覆盖物
                    map.clearMap();
                    //绘制线路
                    drawBuschangeLine(btOrigin,btDestination,busStepsArray[map.line_stay_index],walkStepsArray[map.line_stay_index], map, btPlans[index], {'bus' : '#32bceb', 'walk' : '#6EB034'}, false);
                }
            });
        });
        //展开第一条路线的指导信息
        $('.mapCole h4').eq(0).trigger('click');
    }
    //距离，米换算为千米
    function Getdistance(len) {
        if (len <= 1000) {
            var s = len;
            return s + "米";
        } else {
            var s = Math.round(len / 1000);
            return "约" + s + "公里";
        }
    }
    //时间，秒换算为分钟和小时
    function GetTime(time) {
        if (time < 3600) {
            var m = time / 60;
            return Math.round(m) + "分钟";
        } else {
            var h = time / 3600;
            return Math.floor(h) + "小时" + Math.round((h - Math.floor(h)) * 60) + '分钟';
        }
    }
    //绘制路线，每次仅一条
    function drawBuschangeLine(startPot,endPot,BusArr,WalkArr, curr_map, btPlan, line_color,fitView) {
        //自定义起点，终点图标
        var sicon = new AMap.Icon({
            image: "http://cache.amap.com/lbs/static/jsdemo002.png",
            size: new AMap.Size(44,44),
            imageOffset: new AMap.Pixel(-334, -180)
        });
        var eicon = new AMap.Icon({
            image: "http://cache.amap.com/lbs/static/jsdemo002.png",
            size: new AMap.Size(44,44),
            imageOffset: new AMap.Pixel(-334, -134)
        });
        //绘制起点，终点
        var stmarker = new AMap.Marker({
            map:curr_map,
            position:new AMap.LngLat(startPot.lng,startPot.lat), //基点位置
            icon:sicon, //复杂图标
            offset:{x:-16,y:-34} //相对于基点的位置
        });
        var endmarker = new AMap.Marker({
            map:curr_map,
            position:new AMap.LngLat(endPot.lng,endPot.lat), //基点位置
            icon:eicon, //复杂图标
            offset:{x:-16,y:-34} //相对于基点的位置
        });
        //绘制乘车的路线
        for(var j in BusArr) {
            busPolyline = new AMap.Polyline({
                map:curr_map,
                path:BusArr[j],
                strokeColor: line_color['bus'],//线颜色 #005cb5
                strokeOpacity:0.8,//线透明度
                strokeWeight:6//线宽
            });
        }
        //绘制步行的路线
        for (var i in WalkArr) {
            walkPolyline = new AMap.Polyline({
                map: curr_map,
                path:WalkArr[i],
                strokeColor : line_color['walk'], //线颜色 #6EB034
                strokeOpacity:0.6, //线透明度
                strokeWeight : 6//线宽
            });
        }
        //取出需要加换乘、步行图标的位置，这里仅画出第一个换乘方案
        var onbus = new Array();
        var onwalk = new Array();
        var sinseg = btPlan.segments;
        for(var a in sinseg) {
            if(sinseg[a].transit_mode =="WALK") {
                onwalk.push(sinseg[a].transit.origin);
            }
            else {
                onbus.push(sinseg[a].transit.on_station.location);
            }
        }
        //参数fitView是为了不使鼠标在不同线路滑入、滑出时不断的变化地图的位置以及缩放级别，而只在绘制第一条线路和点击线路时自动变化地图缩放级别以及位置
        if(fitView){
            //使地图自适应显示到合适的范围（包括缩放级别）
            curr_map.setFitView();
        }
    }
    //添加marker&infowindow
    function addmarker(i, d) {
        var lngX = d.location.getLng();
        var latY = d.location.getLat();
        var eicon = new AMap.Icon({
            image: "http://cache.amap.com/lbs/static/jsdemo002.png",
            size: new AMap.Size(44,44),
            imageOffset: new AMap.Pixel(-334, -134)
        });
        var markerOption = {
            map:map,
            icon:eicon,
            position:new AMap.LngLat(lngX, latY),
            topWhenMouseOver:true,
            offset:{x:-17,y:-39} //相对于基点的位置
        };
        new AMap.Marker(markerOption);
    }
    /*添加全局的接口 需要字符串参数：address_end 面试地址*/
    window.feedbackMapWinInit = feedbackMapWinInit;
});